import { StyleSheet } from 'react-native';

import size from './../common/common.style.js';

import {height , width} from './../common/size';

const styles = StyleSheet.create({
   Wraaper:{
     backgroundColor:"#fff"
   },
   navBar:{
      height:size.$60,
      backgroundColor:'#f40',
      flexDirection:"row",
      paddingTop:size.$20
   },
   logo:{
      width:size.$40,
      height:size.$40,
      alignItems:"center",
      justifyContent:"center"
   },
   logoImage:{
      width:size.$26,
      height:size.$20
   },
   sreachHoder:{
      width:size.$324,
      height:size.$40,
      alignItems:"center",
      justifyContent:"center"
   },
   sreachHoderInner:{
      width:size.$324,
      height:size.$28,
      backgroundColor:"#B52600",
      borderRadius:size.$4,
      alignItems:"center",
      justifyContent:"center",
   },
   sreachHoderText:{
      color:"#fff",
      fontSize:size.$13
   },
   scrollViewStyle:{
      height:height - size.$100
   },
   banners:{},
   slider:{
      flex: 1,
      justifyContent: 'center',
      alignItems: 'center',
   },
   sliderImage:{
      height:size.$120,
      width:size.$375,
   },
   pagContair:{
      position:"absolute",
      flexDirection:"row",
      bottom:size.$10,
      right:size.$10
   },
   activePag:{
      height:size.$9,
      width:size.$9,
      backgroundColor:"#f40",
      borderRadius:size.$9,
      marginLeft:size.$9,
      borderWidth:1,
      borderStyle:"solid",
      borderColor:"#f40"
   },
   defaultPag:{
      height:size.$9,
      width:size.$9,
      backgroundColor:"rgba(255,255,255,.4)",
      borderRadius:size.$9,
      marginLeft:size.$9,
      borderWidth:1,
      borderStyle:"solid",
      borderColor:"#ccc"
   },
   shopItemWrap:{
      paddingTop:size.$16,
      paddingLeft:size.$5,
      paddingRight:size.$5
   },
   shopItem:{
      flexDirection:"row",
      marginBottom:size.$16
   },
   itemList:{
      flex:1,
      justifyContent: 'center',
      alignItems: 'center',
   },
   itemListImage:{
      width:size.$60,
      height:size.$42
   },
   shopTitle:{
      fontSize:size.$13,
      marginTop:size.$8,
      color:'#666'
   },
   line:{
      height:size.$10,
      backgroundColor:"#ececec",
   },
   gifsListWrap:{
      flexDirection:"row",
      backgroundColor:"#f2f2f2",
      flexWrap:"wrap",
      alignItems:"center",
      justifyContent:"space-between"
   },
   gifsList:{
      width:size.$185,
      backgroundColor:"#fff",
      marginBottom:size.$6,
      paddingBottom:size.$14

   },
   gifListEven:{
      marginLeft:size.$3
   },
   gifListodd:{

   },
   gifsListImage:{
      width:size.$185,
      height:size.$190
   },
   gifsListText:{
      paddingTop:size.$10,
      paddingLeft:size.$10,
      fontSize:size.$15,
      lineHeight:size.$18,
      color:"#444",
   },
   gifPrices:{
      paddingTop:size.$10,
      paddingLeft:size.$10,
      color:"#f40",
      fontSize:size.$15
   },
   footerBar:{
      height:size.$40,
      borderStyle:"solid",
      borderTopWidth:1,
      borderColor:"#ececec",
      flexDirection:"row",
      alignItems:"center"
   },
   footerItem:{
      flex:1,
      height:size.$40,
      alignItems:"center",
      justifyContent:"center"
   },
   footerItemText:{
      fontSize:size.$12,
      color:"#454545"
   },
   loadingView:{
      position:"absolute",
      height:height,
      width:width,
      zIndex:99,
      backgroundColor:"rgba(0,0,0,.3)",
      left:0,
      top:0
   }
});



export default styles;